<template>
    <el-result title="404" sub-title="抱歉，页面走丢了">
        <template #icon>
            <div class="font-lg">404</div>
        </template>
        <template #extra>
            <el-button type="primary" @click="goHome">回到首页</el-button>
        </template>
    </el-result>
</template>

<script setup>
import { useRouter } from 'vue-router';
import {useStore } from 'vuex'

const router = useRouter();
const store = useStore();

const goHome = () => {
    store.dispatch('changeIndex', '0');
    router.push('/')
}
</script>
<style >
.font-lg {
    margin-top: 40px;
    font-size: 150px;
    font-weight: bold;
    text-align: center;
    color: var(--el-color-primary);
}
</style>